<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title>积分系统</title>
    <link rel="stylesheet" href="/Public/FrozenUI/css/frozen.css">
    <link rel="stylesheet" href="/Public/FrozenUI/css/demo.css">
    <link rel="stylesheet" href="/Public/Admin/bootstrap/css/font-awesome.min.css">
</head>
<body ontouchstart="">
<header class="ui-header ui-header-positive ui-border-b" style="background:#65CEA7" id="header">
    <i class="ui-icon-return" onclick="$.myfunction.back()" style="height:44.8px;line-height:44.8px;font-size:32px"></i><h1>积分系统</h1>
</header>
<section class="ui-container" id="container">
</section>
<footer class="ui-footer ui-footer-btn" style="height:55px">
    <ul class="ui-tiled ui-border-t ui-txt-info" id="footer-ui">
        <li data-href="" class="ui-border-r" style="color:#65CEA7" onclick="$.myfunction.jump('{:U('Home/login')}','登录',0,'')">
            <i class="fa fa-home" aria-hidden="true"></i>
            <div style="color:#000;font-size:12px">首页</div>
        </li>
        <li data-href="" class="ui-border-r" onclick="$.myfunction.jump('{:U('Home/sort')}','积分排行',1,'')">
            <i class="fa fa-bar-chart" aria-hidden="true"></i>
            <div style="font-size:12px">排行</div>
        </li>
        <li data-href="" class="ui-border-r" onclick="$.myfunction.jump('{:U('Home/office')}','办公',2,'')">
            <i class="fa fa-newspaper-o" aria-hidden="true"></i>
            <div style="font-size:12px">办公</div>
        </li>
        <li data-href="" onclick="$.myfunction.jump('{:U('Home/center')}','个人中心',3,'')">
            <i class="fa fa-user" aria-hidden="true"></i>
            <div style="font-size:12px">我</div>
        </li>
    </ul>
</footer>
<script src="/Public/FrozenUI/lib/zepto.min.js"></script>
<script src="/Public/FrozenUI/js/frozen.js"></script>
<script>
    $(document).ready(function(){
        var count=[];//用于url的回退处理
        var position=[];//用于判断当前底部按钮
        //底部颜色转换
        $('#footer-ui li').each(function(){
            $(this).click(function(){
                $('#footer-ui li').css('color','');
                $('#footer-ui li div').css('color','');
                $(this).css('color','#65CEA7');
                $(this).children('div').css('color','#000');
            });
        });
        //自定义函数 via Neah Laurence
        $.myfunction = {
            //跳转
            jump: function(url,title,posit,index){ // 参数：跳转路径 页面title 当前按钮 路径数组的index
                $.post(url,function(data){ $('#container').html(data)});
                if(title.length!=0){
                    $('#header h1').html(title);
                }else{
                    $('#header h1').html('积分系统');
                }
                if(posit !== ''){
                    //如果posit不为空，也就是改变了底部按钮，那就把底部按钮的值传给position
                    position.push(posit);
                }else if(posit === ''){
                    //如果posit为空，那就是没有改变按钮，那就把上一次的值复制给当前
                    position.push(position[(position.length)-1]);
                }
                if(index!==0){
                    count.push(url);
                }else if(index === 0 ){
                    count.length=0;
                }
            },
            //回退
            back:function(){
                count.splice((count.length)-1,1);//删除当前，找上一次的url
                backurl=count.pop();//获取最后一个url,并干掉
                position.splice((position.length)-1,1);
                lastposition=position.pop();
                $.myfunction.jump(backurl,'积分系统');
                //处理底部按钮色彩
                $('#footer-ui li').css('color','');
                $('#footer-ui li div').css('color','');
                $('#footer-ui li').eq(lastposition).css('color','#65CEA7');
                $('#footer-ui li').eq(lastposition).children('div').css('color','#000');
            }
        }
        //页面预加载
        $.myfunction.jump('{:U('Home/task')}','首页',0,0);
    });


</script>
</body>
</html>